$.extend({ menuOpt: {} });
$.extend($.menuOpt, {
  menu: [
    { icon: "layui-icon-shrink-right", id: "menuProp" },
    { icon: "layui-icon-add-1", id: "zoomOut" },
    { icon: "layui-icon-refresh", id: "zoomToFit" },
    { icon: "layui-icon-subtraction", id: "zoomIn" },
  ],
  init: function () {
    this.initPage();
    this.initEvent(); //初始化事件
  },
  initPage() {
    var btnDom = "";
    this.menu.forEach((item) => {
      btnDom += `<div class="btn-box">
                    <button attr-id="${item.id}" type="button" class="layui-btn layui-btn-sm">
                        <i class="layui-icon ${item.icon}"></i>
                    </button>
                </div>`;
    });
    var groupDom = `<div class="layui-btn-group app-menu-opt"></div>`;
    $("body").append(groupDom);
    $(".app-menu-opt").append(btnDom);
  },
  initEvent() {
    var that = this;
    $(".btn-box button").click(function () {
      let id = $(this).attr("attr-id");
      that[id]();
    });
  },
  //展示元器件属性信息
  menuProp: function () {
    $.propComp.menuPropClick();
  },
  /**
   * 函数名称：Rainier.UI.V2.CanvasMenu.zoomIn<br>
   * 函数功能：放大帆布<br>
   * 参数输入：无<br>
   * 参数输出：无<br>
   * 函数返回：无<br>
   * 异常信息：无<br>
   */
  zoomIn: function () {
    this.zoomHandle("zoomIn");
  },

  /**
   * 函数名称：Rainier.UI.V2.CanvasMenu.zoomOut<br>
   * 函数功能：缩小帆布<br>
   * 参数输入：无<br>
   * 参数输出：无<br>
   * 函数返回：无<br>
   * 异常信息：无<br>
   */
  zoomOut: function () {
    this.zoomHandle("zoomOut");
  },

  /**
   * 函数名称：Rainier.UI.V2.CanvasMenu.zoomToFit<br>
   * 函数功能：还原帆布<br>
   * 参数输入：无<br>
   * 参数输出：无<br>
   * 函数返回：无<br>
   * 异常信息：无<br>
   */
  zoomToFit: function () {
    this.zoomHandle("zoomToFit");
  },
  zoomHandle(type) {
    let context = window.app.getContext();
    let activeEditor = context.getActiveEditor();
    let canvas = activeEditor.canvas;
    var zoom = canvas.getZoom();
    if (type == "zoomToFit") {
      let id = $.tabComp.getTabSelectLayid();
      let json = experimentData[id].json || experimentData[id];
      let zoom = json.experimentInfo.zoom;
      canvas.setZoom(zoom, true);
      $.canvasScaleTranslate.scrollToByFirstFigure(zoom);
    } else if (type == "zoomOut") {
      zoom > 0.1 && canvas.setZoom(zoom - 0.1, true);
      zoom > 0.1 && $.canvasScaleTranslate.scrollToByFirstFigure(zoom - 0.1);
    } else if (type == "zoomIn") {
      zoom < 1.5 && canvas.setZoom(zoom + 0.1, true);
      zoom < 1.5 && $.canvasScaleTranslate.scrollToByFirstFigure(zoom + 0.1);
    }
    // return false;
    // $.outer.scrollToViewCenter();
  },
});
